﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Geolocation.aspx.cs" Inherits="BugSysSolution.HTML5Info.Geolocation" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <a href="http://www.w3school.com.cn/html5/html_5_geolocation.asp" style="color: Red">
            HTML5 Geolocation(地理定位)</a>用于定位用户的位置.(比如APP store附近的人打折什么的..)
    </div>
    <br />
    <div>
        他所有的API都是 navigator.geolocation对象提供的</div>
    <div>
        <span style="color: Red">getCurrentPosition</span> 用来获取用户当前的位置信息，该方法带有三个参数：
        <br />
        1、successCallback：成功获取用户位置信息后的回调函数
        <br />
        2、errorCallback：获取用户位置信息失败时的回调函数<br />
        3、positionOptions：可选。获取用户位置信息的配置参数
    </div>
    <br />
    <div>
        <span style="color: Red">successCallback</span>回调函数有2个：属性 coords 和 timestamp 其中
        coords 有7个属性<br />
        a:accuracy：精确度
        <br />
        b:latitude：纬度<br />
        c:longitude：经度<br />
        d:altitude：海拔<br />
        e:altitudeAcuracy：海拔高度的精确度<br />
        f:heading：朝向<br />
        g:speed:速度?<br />
    </div>
    <br />
    <div>
        <span style="color: Red">errorCallback</span>2个参数 message,code<br />
        0-UNKNOW_ERROR：表示不包括在其它错误代码中的错误，这里可以在 message 中查找错误信息,<br />
        1-PERMISSION_DENIED：表示用户拒绝浏览器获取位置信息的请求
        <br />
        2-POSITION_UNAVALIABLE：表示网络不可用或者连接不到卫星<br />
        3-TIMEOUT：表示获取超时。必须在options中指定了timeout值时才有可能发生这种错误<br />
    </div>
    <br />
    <div>
        <span style="color: Red">positionOptions</span>:3个参数,<br />
        a:enableHighAcuracy — 布尔值： 表示是否启用高精确度模式，如果启用这种模式，浏览器在获取位置信息时可能需要耗费更多的时间,<br />
        b:timeout — 整数： 表示浏览需要在指定的时间内获取位置信息，否则触发errorCallback,<br />
        c:maximumAge — 整数/常量： 表示浏览器重新获取位置信息的时间间隔,<br />
    </div>
    <br />
    <div>
        <span style="color: Red">watchPosition()</span>和getCurrentPosition()方法的参数一样,不同的是他是个定时器,时刻监视用户的位置,这里和window.setInterVal()差不多,他返回一个id可以用来停止监听.<span
            style="color: Red">clearWatch()</span>
    </div>
    <div>
        <input type="button" value="GetmyPosition" onclick="getLocation();" />
        <div id="div1" style="border: 1px solid red; width: 200px; height: 20px">
        </div>
    </div>
    </form>
</body>
</html>
<script type="text/javascript">
    var x = document.getElementById("div1")
    function getLocation() {
        if (navigator.geolocation) {
            navigator.geolocation.watchPosition(showPosition, showError, null);
        }
        else { x.innerHTML = "Geolocation is not supported by this browser."; }
    }
    function showPosition(position) {
        x.innerHTML = "Latitude: " + position.coords.latitude + "<br />Longitude: " + position.coords.longitude;
    }

    function showError(error) {
        switch (error.code) {
            case error.PERMISSION_DENIED:
                x.innerHTML = "User denied the request for Geolocation."
                break;
            case error.POSITION_UNAVAILABLE:
                x.innerHTML = "Location information is unavailable."
                break;
            case error.TIMEOUT:
                x.innerHTML = "The request to get user location timed out."
                break;
            case error.UNKNOWN_ERROR:
                x.innerHTML = "An unknown error occurred."
                break;
        }
    }
</script>
